const { ccclass, property } = cc._decorator;

@ccclass
export default class Settings extends cc.Component {

    btnYXOpen: cc.Node;
    btnYXClose: cc.Node;
    btnYYOpen: cc.Node;
    btnYYClose: cc.Node;

    yx: cc.Node;
    yy:cc.Node;
    yxProgress: cc.Node;
    yyProgress: cc.Node;


    onLoad() {
        if (cc.vv == null) {
            return;
        }

        this.yx = this.node.getChildByName('yinxiao');
        this.yy = this.node.getChildByName('yinyue');

        this.yxProgress = this.yx.getChildByName('progress');
        this.yyProgress = this.yy.getChildByName('progress');

        this.btnYXOpen = this.yx.getChildByName('btn_yx_open');
        this.btnYXClose = this.yx.getChildByName('btn_yx_close');

        this.btnYYOpen = this.yy.getChildByName('btn_yy_open');
        this.btnYYClose = this.yy.getChildByName('btn_yy_close');

        this.initButtonHandler(this.node.getChildByName('btn_close'));
        this.initButtonHandler(this.node.getChildByName('btn_exit'));

        this.initButtonHandler(this.btnYXOpen);
        this.initButtonHandler(this.btnYXClose);
        this.initButtonHandler(this.btnYYOpen);
        this.initButtonHandler(this.btnYYClose);

        
        cc.vv.utils.addSlideEvent(this.yxProgress, this.node, 'Settings', 'onSlided');
        cc.vv.utils.addSlideEvent(this.yyProgress, this.node, 'Settings', 'onSlided');
        
        this.refreshVolume();
    }


    /**
     * 滑动按钮事件
     */
    onSlided(slider: cc.Slider){
        switch(slider.node.parent.name){
            case 'yinxiao':
                cc.vv.audioMgr.setSFXVolume(slider.progress);
                break;
            case 'yinyue':
                cc.vv.audioMgr.setBGMVolume(slider.progress);
                break;
        }
        this.refreshVolume();
    }

    /**
     * 给所有按钮挂载事件
     * @param btn 
     */
    initButtonHandler(btn: cc.Node) {
        cc.vv.utils.addClickEvent(btn, this.node, 'Settings', 'onBtnClicked');
    }


    /**
     * 所有点击按钮的具体逻辑
     */
    onBtnClicked(event: cc.Event) {
        switch (event.target.name) {

            //关闭设置界面
            case 'btn_close':
                this.node.active = false;
                break;

            //退出登录
            case 'btn_exit':
                cc.sys.localStorage.removeItem('wx_account');
                cc.sys.localStorage.removeItem('wx_sign');
                cc.director.loadScene('login');
                break;

            //打开音效
            case 'btn_yx_open':
                cc.vv.audioMgr.setSFXVolume(1.0);
                this.refreshVolume();
                break;

            //关闭音效
            case 'btn_yx_close':
                cc.vv.audioMgr.setSFXVolume(0);
                this.refreshVolume();
                break;

            //打开背景音乐
            case 'btn_yy_open':
                cc.vv.audioMgr.setBGMVolume(1);
                this.refreshVolume();
                break;

            //关闭背景音乐
            case 'btn_yy_close':
                cc.vv.audioMgr.setBGMVolume(0);
                this.refreshVolume();
                break;
        }
    }

    /**
     * 更新音量、设置界面样式
     */
    refreshVolume(){

        this.btnYXClose.active = cc.vv.audioMgr.sfxVolume > 0;
        this.btnYXOpen.active = !this.btnYXClose.active;
        const yx_width = cc.vv.audioMgr.sfxVolume * 430;
        this.yxProgress.getComponent(cc.Slider).progress = cc.vv.audioMgr.sfxVolume;
        this.yxProgress.getChildByName('progress').width = yx_width;

        this.btnYYClose.active = cc.vv.audioMgr.bgmVolume > 0;
        this.btnYYOpen.active = !this.btnYYClose.active;
        const yy_width = cc.vv.audioMgr.bgmVolume * 430;
        this.yyProgress.getComponent(cc.Slider).progress = cc.vv.audioMgr.bgmVolume;
        this.yyProgress.getChildByName('progress').width = yy_width;
    }

}